<template>
  <el-dialog
    title="导入库区"
    :visible.sync="visible"
    width="35%"
    :before-close="closeFn"
  >
    <!-- 引入上传组件 -->
    <upload-excel :before-upload="beforeUpload" :on-success="onSuccess" />
    <!-- 底部按钮 -->
    <span slot="footer" class="button">
      <el-button class="btnquxiao" @click="closeFn">取 消</el-button>
      <el-button
        type="primary"
        class="btn1"
        @click="submitWork"
      >确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import UploadExcel from '@/components/UploadExcel'
import { uploadHouse } from '@/api'
export default {
  components: {
    UploadExcel
  },
  props: {
    visible: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      statuses: {
        0: '启用',
        1: '停用'
      },
      data: {}
    }
  },
  methods: {
    beforeUpload(file) {
      // 这个函数必须 return 一个布尔值 并且只有 return 出去的是 true 的时候才会执行后续的解析 excel 的操作
      // 如果 reture false，表示校验不通过，不会进行正式的解析操作
      console.log('上传前', file)
      // 文件大小超过 1M 不允许导入
      const isLt1M = file.size / 1024 / 1024 < 1 // 小于1M
      if (isLt1M) {
        return true
      }
      this.$message({
        message: '文件体积不能超过1M',
        type: 'warning'
      })
      return false
    },
    async onSuccess({ results, header }) {
      // results：表体数据
      // header：表头数据
      console.log('上传完成', results, header)
      await uploadHouse(this.data)
      // 数据转换
      // 中英文对照关系
      // const headerRelation = {
      //   '所属仓库': 'warehouseName',
      //   '库区编号': 'code',
      //   '库区名称': 'name',
      //   '温度类型': 'temperatureType',
      //   '承重类型': 'bearingType',
      //   '用途属性': 'useType',
      //   '库区状态': 'status',
      //   '负责人': 'personName',
      //   '联系电话': 'phone',
      //   '库位数量': 'includedNum',
      //   '更新时间': 'updateTime'
      // }
      // this.data = this.getImportData(results, headerRelation)
      console.log(this.data)
    },

    // 转换集合中对象的key为英文
    // 将原始数组遍历一下，拿出里面的每一项
    // 将每一项的key拿出来转换为对应的英文key
    // 通过headerRelation[child]找到对应的英文key
    // 定义一个空对象，通过 空数组 对这个对象添加属性obj[英文的key]=原始对象[中文的key]
    getImportData(results, headerRelation) {
      const resultsArr = []
      results.forEach(item => {
        const obj = {}
        // console.log(Object.keys(item))
        Object.keys(item).forEach(child => {
          // console.log(item[child])
          // console.log(headerRelation[child])
          // if (['timeOfEntry', 'correctionTime'].includes(headerRelation[child])) {
          //   obj[headerRelation[child]] = formatExcelDate(item[child], '-')
          // } else {
          //   obj[headerRelation[child]] = item[child]
          // }
        })
        // 将新的obj放到结果数据中
        resultsArr.push(obj)
        console.log(resultsArr)
      })
      return resultsArr
    },
    async submitWork() {
      await uploadHouse(this.data)
      this.$message.success('上传完成')
    },
    closeFn() {
      this.$emit('close')
    }
  }
}
</script>

<style>
.el-dialog .el-dialog__header {
    padding: 20px 30px 10px;
    box-shadow: 0 0 6px 0 rgb(144 142 142 / 17%);
}
.el-dialog__body {
  padding: 19px 16px;
}
.el-dialog .span{
  margin-left: 15px;
  margin-top: -10px;
}
.button .el-button {
  border-radius: 40px;
  color: black;
  margin-right: 13px;
  margin-top: 4px;
  height: 38px;
  line-height: 7px;
  width: 100px;
}
</style>
